<template>
  <div class="censor-wrapper">
    <div class="app-container clearfix pageHeader">
      <div class="header fl">{{$route.meta.title}}</div>
    </div>
    <div class="app-container margin-content padding-content">
      <el-form :inline="true" :model="form" ref="searchForm" class="demo-form-inline" label-width="125px">
        <el-form-item label="公司中文名">
          <el-input change-on-select v-model="form.corName" placeholder="请输入公司中文名">
          </el-input>
        </el-form-item>
        <el-form-item label="统一社会信用代码">
          <el-input change-on-select v-model="form.creditCode" placeholder="请输入统一社会信用代码">
          </el-input>
        </el-form-item>
        <el-form-item label="组织机构代码">
          <el-input change-on-select v-model="form.orgCode" placeholder="请输入组织机构代码">
          </el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="doSearch">查询</el-button>
          <el-button @click="resetForm">重置</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div class="app-container margin-content padding-content">
      <el-table :height="scrollHeight" :key="tableKey" :data="list" v-loading="listLoading" element-loading-text="正在加载..." style="width: 100%">
        <!-- <el-table-column type="selection" width="55"></el-table-column> -->
        <el-table-column label="序号" type="index" fixed="left"></el-table-column>
        <el-table-column label="用户名" property="username" fixed="left"></el-table-column>
        <el-table-column label="公司中文名" property="nameZH"></el-table-column>
        <el-table-column label="联系人" property="contactPerson"></el-table-column>
        <el-table-column label="联系地址" property="addr"></el-table-column>
        <el-table-column label="统一社会信用代码" property="creditCode"></el-table-column>
        <el-table-column label="组织机构代码" property="copCode"></el-table-column>
        <el-table-column label="营业执照">
          <template slot-scope="scope">
                  <div class="thumbnail" @click="handleClickImg(scope.row)"><img :src="scope.row.mixBusinessLicense" alt=""></div>
</template>
        </el-table-column>
        <el-table-column label="所属区域" property="region"></el-table-column>
        <el-table-column label="企业性质" property="nameEn"></el-table-column>
        <el-table-column label="地址" property="nameEn"></el-table-column>
        <el-table-column fixed="right" label="操作" width="100">
<template slot-scope="scope">
  <el-button @click="handleClick(scope.row)" type="text" size="small">
    审核</el-button>
</template>
    </el-table-column>
      </el-table>
      <div class="pagination-container align-right">
        <el-pagination background :current-page="page.pageNum" v-if="isShow" :page-size="page.pageSize" :total="total" @current-change="handleCurrentChange" layout="total,prev, pager, next, jumper">
        </el-pagination>
      </div>
    </div>

    <!-- 审核 -->
    <el-dialog title="审核" :visible.sync="dialogFormVisible">
  <el-form :model="formDialog" label-width="90px" label-position="left">
    <el-form-item label="审核">
    <el-radio-group v-model="formDialog.censor">
      <el-radio label="1">同意</el-radio>
      <el-radio label="2">拒绝</el-radio>
    </el-radio-group>
  </el-form-item>
  <el-form-item label="拒绝原因" v-show="formDialog.censor === '2'">
    <el-input type="textarea" v-model="formDialog.reason"></el-input>
  </el-form-item>
  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="auditCancle">取 消</el-button>
    <el-button type="primary" @click="auditSubmit">确 定</el-button>
  </div>
</el-dialog>
  
  </div>
</template>

<script>
  import {
    queryAduitList,
    aduitOrg
  } from '@/api/corCensor'
  export default {
    name: 'datasManage',
    components: {},
    data() {
      return {
        options: [],
        form: {
          corName: '',
          creditCode: '',
          orgCode: '',
        },
        dialogFormVisible: false,
        formDialog: {
          id: '',
          censor: '',
          reason: ''
        },
        scrollHeight: null,
        page: {
          pageNum: 1,
          pageSize: 20
        },
        total: 0,
        tableKey: 0,
        listLoading: false,
        list: [],
        isShow: false,
        dataListSelections: [],
        saveSetTimeoutSearch: null
      }
    },
    methods: {
      tableResize() {
        const _height = 320
        this.scrollHeight = document.body.scrollHeight - _height
        window.onresize = () => {
          this.scrollHeight = document.body.scrollHeight - _height
        }
      },
      getList() {
        this.listLoading = true
        this.isShow = false
        let params = {
          nameZH: this.form.corName,
          creditCode: this.form.creditCode,
          copCode: this.form.orgCode,
          pageNum: this.page.pageNum,
          pageSize: this.page.pageSize
        }
        queryAduitList(params).then((res) => {
          console.log(res.data)
          if (res.data.code === 200) {
            this.isShow = true
            //   res = res.data
            this.list = res.data.data.dataList !== '' ? res.data.data.dataList : []
            this.total = res.data.data.total !== '' ? res.data.data.total : 0
            this.listLoading = false
          }
  
        })
      },
      handleClick(row) {
        console.log(row)
        this.formDialog = {
          corId: row.id,
          censor: '',
          reason: ''
        }
        this.dialogFormVisible = true
      },
      handleClickImg(row) {
        console.log(row.businessLicense)
        this.$alert(`<img class="img-big" src="${row.businessLicense}"/>`, `营业执照`, {
          dangerouslyUseHTMLString: true
        });
      },
      // 页码查询
      handleCurrentChange(val) {
        this.page.pageNum = val
        this.getList()
      },
      doSearch() {
        this.page.pageNum = 1
        this.getList();
      },
      resetForm() {
        this.form = {
          typeId: null,
          code: null
        }
      },
      auditCancle() {
        this.formDialog = {
          corId: '',
          censor: '',
          reason: ''
        }
        this.dialogFormVisible = false
      },
      auditSubmit() {
        if (!this.formDialog.censor) {
          this.$message({
            message: '请审核企业',
            type: 'warning',
            showClose: true,
          });
        }

        if (this.formDialog.censor === '2' && this.formDialog.reason === '') {
          this.$message({
            message: '请输入拒绝原因',
            type: 'warning',
            showClose: true,
          })
          return
        }
        let params = {
          id: this.formDialog.corId,
          status: this.formDialog.censor,
          reason: this.formDialog.reason
        }
        aduitOrg(params).then((res) => {
          console.log(res.data)
          if (res.data.code === 200) {
            this.$message('审核成功')
            this.dialogFormVisible = false

            this.page.pageNum = 1
            this.getList()
            
          }
        })

      }
    },
    created() {
  
      //   this.getOrgTree() //获取机构树选项
      this.tableResize()
      this.getList()
  
    }
  }
</script>

<style lang="scss">
  .thumbnail {
    width: 100%;
    // height: 100%
  }
  
  .thumbnail img {
    width: 100%;
    // width: auto;
    min-height: 60px;
  }
  
  .img-big {
    width: 120px;
  }
</style>
